<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>我的</title>
</head>

<body>
    <main>
        <!-- 轮播图 -->
        <!-- <div class="swiper">
            <div class="swiper-wrapper">
              <div class="swiper-slide">
                <img src="../../assets/imgs/run-my1.jpg" alt="">
              </div>
              <div class="swiper-slide">
                <img src="../../assets/imgs/9.jpg" alt="">
              </div>
  
            </div>
            如果需要分页器 -->
            <!-- <div class="swiper-pagination"></div>
          </div> --> 
        <!-- 轮播图结束 -->
        <!-- 个人信息 -->
        <div class="user-info">
             <a href="user-info.html">
                <div class="my-top container mt20">
                    <img id="headPicVal" alt="">
                    <div>
                        <h4 id="nicknameVal" class="c10 f22"> </h4>
                        <a href="user-info.html"><i class="iconfont iconf icon-xiangyou1"></i></a>
                    </div>
                </div>
            </a>
            <p class="container mt16 f18">个人签名:
                <span id="signVal"></span>
            </p>
            <!-- <input type="file" class="mt16" id="fileImg"> -->
        </div>

        <!-- 累计打卡 -->
        <div class="total-punch mt20">
            <div class="container">
                <h4><i class="iconfont icon-daka"></i>累计打卡<span class="punch-days" id="clockCountVal"></span>天数</h4>
              <p>
                <button class="f18" id="clockBtn"></button>
              </p>
            </div>
        </div>
        <!-- 个人动态 -->
        <div class="dynamic mt20">
            <div class="container">
                <h4><i class="iconfont icon-changyongiconyikuozhan_huaban18"></i>个人动态</h4>
                <p><span id="dynamicCount" class="f16">55</span>条<i class="iconfont iconf icon-xiangyou1"></i></p>
            </div>
        </div>
        <!-- 运动数据 -->
    
            <div class="user-sport-data mt20">
             
                <div class="usd container">
                    <div class="sd">
                        <h4><i class="iconfont icon-bule  icon-icon_website_huabanfuben"></i>运动数据</h4>
                        <a href="sport-data.html"><i class="iconfont iconf icon-xiangyou1"></i></a>
                    </div>
                    <div class="sport-consume mt8">
                        <div class="sum-sport">
                            <span class="f18 c8a">总运动</span>
                            <p class="f14 mt8"><span id="sportMinutes"></span>分钟</p>
                        </div>
                        <div class="consume">
                            <span class="f18 c8a">本周消耗</span>
                            <p class="f14 mt8"><span id="kilocalorie"></span>千卡</p>
                        </div>
                    </div>
                </div>
             
            </div>
  
        <!-- 运动徽章 -->
        <div class="bgfff mt20">
            <div class="user-badge">
                <div class="ub" id="badge">
                    <h4><i class="iconfont icon-bule icon-sharpicons_badge-"></i>我的运动徽章</h4>
                    <a href="sport-badge.html"><i class="iconfont iconf icon-xiangyou1"></i></a>
                </div>
                <div class="ub-img mt8">
                    <img src="../../assets/imgs/mybadge01.jpg" alt="">
                    <img src="../../assets/imgs/mybadge02.jpg" alt="">
                    <img src="../../assets/imgs/mybadge03.jpg" alt="">
                  
                </div>
            </div>
            </div>
         <!-- 退出登录 -->
         <div class="bgfff mt20" id="exit-longin">退出登录</div>    
        <!-- 底部 -->
        
    </main>
  
</body>

</html>